<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html>
<html>

	<head>
		<title>审核流程-编辑审核级别</title>
		<meta charset="utf-8">
		<link rel="stylesheet" type="text/css" href="<%=basePath %>libs/bootstrap-3.3.7-dist/css/bootstrap.min.css">
		<link rel="stylesheet" type="text/css" href="<%=basePath %>css/reset.css">
		<link rel="stylesheet" type="text/css" href="<%=basePath %>css/style.css">
		<link rel="stylesheet" type="text/css" href="<%=basePath %>css/iframe.css">

	</head>

	<body>
		<div id="mainContent">
			<div id="mainContent_content">
				<div class="page_header">
					<a href="<%=basePath %>auditFlow/listAllFlow.do">审核流程</a>
					<i class="icon-double-right"></i>
					<a>编辑审核级别</a>
				</div>

				<div class="btn rightBtn">
					<c:if test="${isEdit }">
						<input type="button" value="新增审批级别" onclick="addTR();" class="btn btn1"></input>
						<input type="button" value="保存" onclick="saveEditReturnRequest();" class="btn btn2"></input>
					</c:if>
					<input type="button" value="返回" onclick="location.href='<%=basePath %>auditFlow/listAllFlow.do'" class="btn btn1"></input>
				</div>
				<form id="lossDetailForm" class="form">
					<div id="requisitionForm" class="box">
						<input type="hidden" name="auditFlowID" value="${auditFlow.auditFlowID }"></input>
						<p>
							<label>流程名称</label>
							<input class="form-control" type="text" name="auditFlowName" value="${auditFlow.auditFlowName }" readonly="readonly"></input>

							<label>是否跨级</label>
							<select class="form-control select" name="isSkipLevel" <c:if test="${!isEdit }">disabled</c:if>>
								<option value="0" <c:if test="${auditFlow.isSkipLevel=='0'}">selected</c:if>>不允许</option>
								<option value="1" <c:if test="${auditFlow.isSkipLevel=='1'}">selected</c:if>>允许</option>
							</select>

							<label>流程状态</label>
							<select class="form-control select" name="status" <c:if test="${!isEdit }">disabled</c:if>>
								<option value="0" <c:if test="${auditFlow.status=='0'}">selected</c:if>>正常</option>
								<option value="1" <c:if test="${auditFlow.status=='1'}">selected</c:if>>关闭</option>
							</select>

						</p>
						<p>
							<label>处理人</label>
							<input class="form-control" type="text" readonly value="${auditFlow.lastPersonName }"></input>

							<label>处理时间</label>
							<input class="form-control" type="text" readonly value="${auditFlow.lastProcessingTime.substring(0,19) }"></input>

						</p>
					</div>
					<div class="tableBox box">
						<table class="table table-bordered table_text_center">
							<thead>
								<tr>
									<th>审批级别</th>
									<th>权限组名称</th>
									<th>用户</th>
									<th>需要通过人数</th>
									<c:if test="${isEdit }">
										<th>操作</th>
									</c:if>
								</tr>
							</thead>
							<tbody id="lossItemTbody">
								<c:forEach items="${auditFlowItemList }" var="audit" varStatus="ids">
									<tr>
										<td>
											<input type="text" name="level_S" readonly="readonly" value="${audit.level }" style="width:50px;text-align: center;border: 0;" />
										</td>
										<td>
											<select name="roleID_S" class='form-control select' onchange="queryRoleUser(this);" <c:if test="${!isEdit }">disabled</c:if>>
												<option value="-1">请选择</option>
												<c:forEach items="${roleList }" var="role">
													<option value="${role.roleid }" <c:if test="${role.roleid==audit.roleID }">selected</c:if>>${role.rolename }</option>
												</c:forEach>
											</select>
										</td>
										<td>${audit.userListName }</td>
										<td><input type="text" class='form-control' name="passPersonNumber_S" <c:if test="${!isEdit }">readonly</c:if> value="${audit.passPersonNumber }" data-max="${audit.maxPassPersonNumber }" onchange="numberChange(this);" onkeyup="numberChange(this);" style="width:80px;text-align: center;" /></td>
										<c:if test="${isEdit }">
											<td>
												<a class="up btn btn-xs btn1">上移</a>&nbsp;
												<a class="down btn btn-xs btn1">下移</a>&nbsp;
												<a class="top btn btn-xs btn1">置顶</a>&nbsp;
												<a class="btn btn-xs btn_danger" onclick="deleteItem(this);">删除</a>
											</td>
										</c:if>
									</tr>
								</c:forEach>
							</tbody>
						</table>
					</div>
				</form>
			</div>
			<jsp:include page="/jsp/basic/prompt.jsp"></jsp:include>

			<input type="hidden" id="roleListID" value="${fn:length(roleList)}" />
			<div id="hideSelect" style="display: none;">
				<select name="roleID_S" class='form-control select' onchange="queryRoleUser(this);">
					<option value="-1">请选择</option>
					<c:forEach items="${roleList }" var="role">
						<option value="${role.roleid }">${role.rolename }</option>
					</c:forEach>
				</select>
			</div>

		</div>
		<script src="<%=basePath %>js/jquery-3.2.1.min.js"></script>
		<script src="<%=basePath %>libs/bootstrap-3.3.7-dist/js/bootstrap.js"></script>
		<script src="<%=basePath %>libs/bootstrap-table-master/dist/bootstrap-table.js"></script>
		<script src="<%=basePath %>libs/bootstrap-table-master/dist/locale/bootstrap-table-zh-CN.min.js"></script>
		<script src="<%=basePath %>My97DatePickers/WdatePicker.js"></script>
		<script src="<%=basePath %>js/public.js"></script>
		<script type="text/javascript">
			//实现上移下移
			function upDownTop() {
				//上移 
				var $up = $(".up");
				$up.unbind();
				$up.click(function() {
					var $tr = $(this).parents("tr");
					if($tr.index() != 0) {
						$tr.fadeOut().fadeIn();
						$tr.prev().before($tr);
					}
					sort();
				});
				//下移 
				var $down = $(".down");
				var len = $down.length;
				$down.unbind();
				$down.click(function() {
					var $tr = $(this).parents("tr");
					if($tr.index() != len - 1) {
						$tr.fadeOut().fadeIn();
						$tr.next().after($tr);
					}
					sort();
				});
				//置顶 
				var $top = $(".top");
				$top.unbind();
				$top.click(function() {
					var $tr = $(this).parents("tr");
					$tr.fadeOut().fadeIn();
					$("#lossItemTbody").prepend($tr);
					//$tr.css("color","#f60");
					sort();
				});
			}

			//实现换位置后改变顺序
			function sort() {
				var leng = $("#lossItemTbody tr").length;
				for(var i = 0; i < leng; i++) {
					$("#lossItemTbody tr").eq(i).find("td:first").children("input[type=text]").val(i + 1);
				}
			}

			//删除当前项
			function deleteItem(obj) {
				$(obj).parent().parent().remove();
				sort();
			}

			//新增
			function addTR() {
				var trSize = $("#lossItemTbody tr").length;
				var listSize = $("#roleListID").val();
				if(trSize < listSize) {
					var html = "<tr>";
					html += "<td><input type='text' name='level_S' readonly='readonly' style='width:50px;text-align: center;border: 0;'/></td>";
					html += "<td>" + $("#hideSelect").html() + "</td>";
					html += "<td></td>";
					html += "<td><input type='text' class='form-control' name='passPersonNumber_S' value='0' data-max='' onchange='numberChange(this);' onkeyup='numberChange(this);' style='width:80px;text-align: center;' /></td>";
					html += "<td><a class='up btn btn-xs btn1'>上移</a>&nbsp;&nbsp;<a class='down btn btn-xs btn1'>下移</a>&nbsp;&nbsp;<a class='top btn btn-xs btn1'>置顶</a>&nbsp;&nbsp;<a class='btn btn-xs btn_danger' onclick='deleteItem(this);'>删除</a></td>";
					html += "</tr>";
					$("#lossItemTbody").append(html);
					upDownTop(); //实现上移下移
					sort(); //实现换位置后改变顺序
				} else {
					Prompt.alert("提示", "审批级别总数不能超过权限组数量");
				}
			}

			//权限组选择事件
			function queryRoleUser(obj) {
				$.ajax({
					url: "<%=basePath %>auditFlow/queryRoleUserByRoleId.do",
					type: "POST",
					dataType: "json",
					data: "roleID=" + $(obj).val(),
					success: function(data) {
						$(obj).parent("td").next().html(data.userListName);
						$(obj).parent("td").next().next().children("input[type=text]").val(data.passPersonNumber);
						$(obj).parent("td").next().next().children("input[type=text]").attr("data-max", data.passPersonNumber);
					},
					error: function() {
						Prompt.alert("提示", "网络异常或服务异常，请重试！");
					}
				});
			}

			//判断输入数字
			function numberChange(obj) {
				obj.value = obj.value.replace(/\D/g, '');
				var num = obj.value;
				if(num == '' || num <= 0) num = 1;
				var max = $(obj).data("max");
				if(num > max) {
					num = max;
				}
				obj.value = num;
			}

			//保存前判断表单
			function validateForm() {
				if($("#lossItemTbody tr").length == 0) {
					Prompt.alert("提示", "审批级别数量不能为0！");
					return false;
				}

				if($("input[name='auditFlowName']").val() == "") {
					Prompt.alert("提示", "审批流程名称不能为空！");
					return false;
				}
				if($("input[name='auditFlowName']").val().length > 32) {
					Prompt.alert("提示", "审批流程名称字数过长！");
					return false;
				}

				var list = $("#lossItemTbody tr");
				for(var i = 0; i < list.length; i++) {
					var o1 = $(list[i]).find("td").eq(1).find("select").val();
					var o1_input = $(list[i]).find("td").eq(3).find("input").val();
					if(o1 <= 0) {
						Prompt.alert("提示", "请选择权限组！");
						return false;
					}
					if(o1_input <= 0) {
						Prompt.alert("提示", "权限组的通过人数不能为0！");
						return false;
					}
					for(var j = 0; j < list.length; j++) {
						if(i == j) continue;
						var o2 = $(list[j]).find("td").eq(1).find("select").val();
						if(o1 == o2) {
							Prompt.alert("提示", "审批级别不能使用同一权限组！");
							return false;
						}
					}
				}

				return true;
			}

			//保存信息
			function saveEditReturnRequest() {
				if(!validateForm()) return;
				$.ajax({
					url: "<%=basePath %>auditFlow/updateEditFlowInfo.do",
					type: "post",
					async: false,
					dataType: "json",
					data: $("#lossDetailForm").serialize(),
					success: function(data) {
						if(data.result == "success") {
							Prompt.alert("提示", "保存成功！", function() {
								location.href = "<%=basePath %>auditFlow/listAllFlow.do";
							});
						} else {
							Prompt.alert("提示", "保存失败！");
						}
					},
					error: function() {
						Prompt.alert("提示", "网络异常或服务异常，请重试！");
					}
				});
			}

			//实现上移下移
			$(function() {
				upDownTop();
			});
		</script>
	</body>

</html>